﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeFile="chapter.edit.aspx.cs" Inherits="admin_chapter_edit" %>

<%@ Import Namespace="Infrastructure.Utility" %>
<asp:Content ContentPlaceHolderID="titleContent" runat="Server">章节[编辑]</asp:Content>
<asp:Content ContentPlaceHolderID="headContent" runat="Server">
    <link href="/content/font-awesome/css/font-awesome.css" rel="stylesheet" />
    <link href="/content/bootstrap/ext/summernote/summernote.css" rel="stylesheet" />
    <link href="/content/uploadify/uploadify.css" rel="stylesheet" />
    <link href="/content/css/form.css" rel="stylesheet" />
    <style type="text/css">
        #title {
            width: 100%;
        }

            #title.normal {
                border: none;
            }

            #title.hover {
                border: 1px solid #ccc;
            }
        /**
 * 横向滚动
 * ------------------------------ */
        .scroll_horizontal {
            position: relative;
            height: 160px;
            padding: 10px;
            background-color: #eee;
            border: 1px solid gray;
            margin-right: 59px;
        }

            .scroll_horizontal .box {
                overflow: hidden;
                position: relative;
                width: 90%;
                margin: 0 auto;
            }

            .scroll_horizontal .list {
                overflow: hidden;
                width: 9999px;
                list-style-type: none;
            }

                .scroll_horizontal .list li {
                    float: left;
                    width: 200px;
                }

            .scroll_horizontal .prev,
            .scroll_horizontal .next {
                position: absolute;
                top: 50%;
                margin-top: -25px;
                width: 40px;
                height: 50px;
                background-image: url(/content/jquery.cxscroll-1.2.2/img/control.png);
                background-repeat: no-repeat;
                font: 0/0 Arial;
                cursor: pointer;
            }

            .scroll_horizontal .prev {
                left: 5px;
                background-position: 0 0;
            }

            .scroll_horizontal .next {
                right: 5px;
                background-position: -40px 0;
            }

            .scroll_horizontal .prev:hover {
                background-position: 0 -50px;
            }

            .scroll_horizontal .next:hover {
                background-position: -40px -50px;
            }

        #basic-toolbar {
            display: none;
            position: absolute;
        }
    </style>
</asp:Content>
<asp:Content ContentPlaceHolderID="mainContent" runat="Server">
    <form runat="server">
        <div>
            <input id="title" name="title" type="text" class="form-control text-center" onkeyup="showSaveButton();" style="font-size: 16px; font-weight: bold; width: 93%;" value="<%=Data("title")%>" />
            <div style="height: 5px;"></div>
        </div>

        <div>
            <textarea name="content1" id="content1" class="hidden">
                <%=Data("content") %>
            </textarea>
            <textarea name="content" id="content" onchange="showSaveButton();">
                <%=Data("content") %>
            </textarea>


        </div>
        <div>
            <div>
                <div class="pull-left">
                    <h4>相关视频:</h4>
                </div>
                <div class="pull-right" style="margin-right: 59px">
                    <span id="uploadify-video"></span>
                </div>
                <div class="clearfix"></div>
            </div>
            <hr style="margin-bottom: 5px; margin-top: 5px; margin-right: 59px" />
            <div id="video-list" class="scroll_horizontal">
                <div class="box">
                    <ul class="list">
                        <asp:Repeater runat="server" ID="lstVideo">
                            <ItemTemplate>
                                <li>
                                    <div>
                                        <input type="hidden" class="video-key" value="<%# Eval("vid") %>" />
                                        <input type="hidden" class="video-key" value="<%# Eval("href") %>" />
                                        <img src="<%# Eval("thumbnail") %>" style="width: 180px; height: 120px;" alt="<%# Eval("title") %>" />
                                        <p><%# Eval("title") %></p>
                                    </div>
                                </li>
                            </ItemTemplate>
                        </asp:Repeater>
                    </ul>
                </div>
            </div>
            <br />
            <div>
                <div class="pull-left">
                    <h4>练习题:</h4>
                </div>
                <div class="pull-right" style="margin-right: 59px">
                    <a class="btn btn-success" href="question.edit.aspx?cid=<%=chapterId %>" target="_self"><i class="cus-icon-add"></i>添加</a>
                    <a class="btn btn-danger"><i class="cus-icon-delete"></i>删除</a>
                </div>
                <div class="clearfix"></div>
            </div>
            <hr style="margin-bottom: 5px; margin-top: 5px; margin-right: 59px" />
            <div style="margin-right: 59px;">
                <table class="table gridview">
                    <tr>
                        <th>
                            <input type="checkbox" onchange="$(this).parentsUntil('table').find('.selector').attr('checked',this.checked);" />
                            选择
                        </th>
                        <th>标题</th>
                        <th>内容</th>
                        <th>题型</th>
                        <th>分值</th>
                        <th>答案</th>
                        <th>操作</th>
                    </tr>
                    <asp:Repeater ID="lstQuestion" runat="server">
                        <ItemTemplate>
                            <tr>
                                <td>
                                    <input type="checkbox" class="selector" name="selector" value="<%# Eval("qid") %>" />
                                    <input type="hidden" />
                                </td>
                                <td><%#Eval("title") %></td>
                                <td><%#Eval("content") %></td>
                                <td><%#Eval("typeName") %></td>
                                <td><%#Eval("score") %></td>
                                <td><%#Eval("answers") %></td>
                                <td><a href="question.edit.aspx?cid=<%=chapterId %>&qid=<%#Eval("qid") %>" target="_self">编辑</a></td>
                            </tr>
                        </ItemTemplate>
                    </asp:Repeater>
                </table>
            </div>
        </div>
    </form>
    <span id="basic-toolbar">
        <a class="btn btn-success" href="javascript:void(0);" onclick="saveBasicInfo();"><i class="cus-icon-save"></i>保存</a>
    </span>
</asp:Content>
<asp:Content ContentPlaceHolderID="scriptContent" runat="Server">
    <script type="text/javascript">
        var chapterId = <%= chapterId%>;
    </script>
    <script src="/content/bootstrap/ext/summernote/summernote.js" type="text/javascript"></script>
    <script src="/content/jquery.cxscroll-1.2.2/js/jquery.cxscroll.js" type="text/javascript"></script>
    <script src="/content/uploadify/jquery.uploadify.js" type="text/javascript"></script>

    <script type="text/javascript">
        $(document).ready(function () {
            $('#content').summernote({ width: 800, height: 200,onChange: function(){
                if($("#content1").val() != $("#content").val()) showSaveButton();
            }});//
            $('#video-list').cxScroll({ auto:false });

            $("#uploadify-video").uploadify({
                swf: '/content/uploadify/uploadify.swf',
                uploader: "chapter.edit.aspx?do=add-video&cid=" + chapterId,
                'auto': true,
                'buttonText': '<a class="btn btn-success" href="javascript:void(0)"><i class="cus-icon-arrow_up"></i>上传</a>',
                'multi': false,
                'sizeLimit': '500MB',
                'removeTimeout': 2, //进度条消失秒数
                'successTimeout': 600,
                'onUploadSuccess': function (file, dataText, response) { //上传成功回调方法
                    var result = eval("(" + dataText + ")");
                    if (result.success) {
                        for(var i = 0; i < result.data.length; i ++ ){
                            var chtml = "<li><div><input type=\"hidden\" class=\"video-key\" value=\"" + result.data[i].vid + "\" />"
                                            + "<input type=\"hidden\" class=\"video-key\" value=\"" + result.data[i].href + "\" />"
                                            + "<img src=\"" + result.data[i].thumbnail + "\" style=\"width: 180px; height: 120px;\" alt=\"" + result.data[i].title + "\" />"
                                            + "<p>" + result.data[i].title + "</p></div></li>";
                            $("#video-list").find("ul.list").append($(chtml));
                            $('#video-list').cxScroll({ auto:false });
                        }
                    }
                }
            });
        });
        var showSaveButton = function (){
            var targetEl = $("#title");
            var location = targetEl.position();
            $("#basic-toolbar").css({
                left: location.left + targetEl.width() + 30,
                top: location.top
            }).show();

        };
        var saveBasicInfo = function(){
            request(window.location.href,{save:"basic", title: $("#title").val(), content: $("#content").val() }, function(){
                $("#basic-toolbar").hide();
            }, function(result){
                alert(result.message);
            });
        };
    </script>
</asp:Content>

